
/**
 * Created by chocolate on 16/5/4.
 */
import React, {
    Component,
    StyleSheet,
    Text,
    ListView,
    TouchableOpacity,
    View,
    Image,
} from 'react-native';

/**
 * "发现"页面,每一行的小图片
 * @type {*[]}
 */
var THUMB_URLS = [
    require('../../icon/noticeboard.png'),
    require('../../icon/addresslist.png'),
    require('../../icon/di-record.png'),
    require('../../icon/courselist.png'),
    require('../../icon/askforleave.png'),
    require('../../icon/disclaimer.png'),
];

var ENTER_ARROW = require('../../icon/enter-arrow.png');

var Title =require('./Title');
var discoverItem = [
    '校务公告',
    '通讯录',
    '学生滴卡记录',
    '课程表',
    '请假申请',
    '模拟测试',
];
class Discover extends Component{
    constructor(props){
        super(props);
        var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
        this.state={
            dataSource:ds.cloneWithRows(discoverItem)
        };
        console.log("从主界面传递给发现模块的用户账号为:"+this.props.user.phone);
        console.log("此用户所绑定的孩子个数为:"+this.props.childList.length);
    }

  /**
   * 点击Item时的相应函数
   * @param row
   * @private
   */
    _onPressRow(row){
      if(row === 0){
        this.props.navigator.push({name:'NoticeList'});  //校务公告
      }
      else if(row === 1){
        this.props.navigator.push({name:'Address',params:{user:this.props.user}});   //滴卡记录
      }
      else if(row === 2){
        this.props.navigator.push({name:'DiCalendar',params:{user:this.props.user,childList:this.props.childList}});   //滴卡记录
      }
      else if(row === 3){
        this.props.navigator.push({name:'Course',params:{user:this.props.user,childList:this.props.childList}});   //滴卡记录
      }
      else if(row === 4){
        console.log("将用户信息和孩子信息传递给请假申请模块");
        this.props.navigator.push({name:'LeaveList',params:{user:this.props.user,childList:this.props.childList}});   //请假申请
      }
      else if(row === 5){
        this.props.navigator.push({name:'SimuEvent',params:{user:this.props.user,childList:this.props.childList}});
      }

    }


  render(){
      return(
        <View style={styles.container}>
          <Title title={{center:"发现"}}></Title>

          <TouchableOpacity style={styles.row} onPress = {()=>{this._onPressRow(0)}}>
            <View style={styles.titleContainer}>
              <Image style={styles.thumb} source={THUMB_URLS[0]} />
              <Text style={styles.text}>{discoverItem[0]}</Text>
            </View>
            <Image style={styles.enterIcon} source={ENTER_ARROW} />
          </TouchableOpacity>

           <TouchableOpacity style={styles.row} onPress = {()=>{this._onPressRow(1)}}>
            <View style={styles.titleContainer}>
              <Image style={styles.thumb} source={THUMB_URLS[1]} />
              <Text style={styles.text}>{discoverItem[1]}</Text>
            </View>
            <Image style={styles.enterIcon} source={ENTER_ARROW} />
          </TouchableOpacity>

           <TouchableOpacity style={styles.row} onPress = {()=>{this._onPressRow(2)}}>
            <View style={styles.titleContainer}>
              <Image style={styles.thumb} source={THUMB_URLS[2]} />
              <Text style={styles.text}>{discoverItem[2]}</Text>
            </View>
            <Image style={styles.enterIcon} source={ENTER_ARROW} />
          </TouchableOpacity>

           <TouchableOpacity style={styles.row} onPress = {()=>{this._onPressRow(3)}}>
            <View style={styles.titleContainer}>
              <Image style={styles.thumb} source={THUMB_URLS[3]} />
              <Text style={styles.text}>{discoverItem[3]}</Text>
            </View>
            <Image style={styles.enterIcon} source={ENTER_ARROW} />
          </TouchableOpacity>

           <TouchableOpacity style={styles.row} onPress = {()=>{this._onPressRow(4)}}>
            <View style={styles.titleContainer}>
              <Image style={styles.thumb} source={THUMB_URLS[4]} />
              <Text style={styles.text}>{discoverItem[4]}</Text>
            </View>
            <Image style={styles.enterIcon} source={ENTER_ARROW} />
          </TouchableOpacity>

          <TouchableOpacity style={styles.row} onPress = {()=>{this._onPressRow(5)}}>
            <View style={styles.titleContainer}>
              <Image style={styles.thumb} source={THUMB_URLS[5]} />
              <Text style={styles.text}>{discoverItem[5]}</Text>
            </View>
            <Image style={styles.enterIcon} source={ENTER_ARROW} />
          </TouchableOpacity>

        </View>
      )
  }
}

const styles = StyleSheet.create({
    container: {
        backgroundColor: '#eeeeee',
        flex: 1,
    },
    listView: {
    },
    row:{
        flexDirection: 'row',
        backgroundColor:'#FFF',
        height:60,
        justifyContent: 'space-between',
        alignItems:'center',
        marginTop:10,
    },
    titleContainer:{
      marginLeft:26,
      flexDirection: 'row',
      alignItems:'center',
      justifyContent: 'flex-start',
    },
    text:{
        marginLeft:16,
        fontSize:16,
        color:'#04679b',
    },
    thumb: {
    },
    enterIcon: {
      marginRight:26,
    },
})

module.exports = Discover;